border-1px($color)
  position: relative
  &:after
    display: block
    position: absolute
    left: 0
    bottom: 0
    width: 100%
    border-top: 1px solid $color
    content: ' '

border-none()
  &:after
    display: none

bg-image($url)
  background-image: url($url + "@2x.png")
  @media (-webkit-min-device-pixel-ratio: 3),(min-device-pixel-ratio: 3)
    background-image: url($url + "@3x.png")


//- 在第一个子元素的前面加伪标签
//- 解决同行多元素垂直居中问题
//- 它的高度为父元素的100%，在所有子元素中最高，浏览器以它的中线为基线，将其他子元素与它对齐
vert-align()
  &:before
    display: inline-block
    height: 100%
    content: ''
    vertical-align: middle !important